<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="css/base.css" />
<link rel="stylesheet" href="css/info-mgt.css" />
<link rel="stylesheet" href="css/WdatePicker.css" />
<link rel="stylesheet" href="layui/css/layui.css"  media="all">
<script type="text/javascript" src="js/jquery.js"></script>
<script src="layui/layui.js"></script>
 <link href="umeditor/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
    <script type="text/javascript" src="umeditor/third-party/jquery.min.js"></script>
    <script type="text/javascript" src="umeditor/third-party/template.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="umeditor/umeditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="umeditor/umeditor.min.js"></script>
    <script type="text/javascript" src="umeditor/lang/zh-cn/zh-cn.js"></script>
<title>天宫智能办公系统</title>
</head>
<body>
<div class="title">
  <h2>发布文章</h2>
</div>
<form class="layui-form" action="">
  <div class="layui-form-item" style="margin-top:10px; width:95%">
    <label class="layui-form-label">文章标题</label>
    <div class="layui-input-block">
      <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="文章标题" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item" style="width:95%">
    <label class="layui-form-label">文章关键字</label>
    <div class="layui-input-block">
      <input type="text" name="username" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item" style="margin-top:10px; width:95%">
    <label class="layui-form-label">文章类别</label>
    <div class="layui-input-block">
      <select name="interest" lay-filter="aihao">
        <option value=""></option>
        <option value="0">写作</option>
        <option value="1" selected="">阅读</option>
        <option value="2">游戏</option>
        <option value="3">音乐</option>
        <option value="4">旅行</option>
      </select>
    </div>
  </div>
  <input type="file" name="file" style="margin-left:109px; margin-bottom:20px">
  <div class="layui-form-item layui-form-text" style="width:95%">
    <label class="layui-form-label">文章概要</label>
    <div class="layui-input-block">
      <textarea placeholder="请输入内容" class="layui-textarea"></textarea>
    </div>
  </div>
  <div class="layui-form-item layui-form-text" style="width:95%">
    <label class="layui-form-label">文章内容</label>
    <div class="layui-input-block">
     <script type="text/plain" id="myEditor" style="width:100%;height:240px;">
    <p>这里我可以写一些输入提示</p>
</script>
    </div>
  </div>
  <div class="layui-form-item" style="width:95%">
    <div class="layui-input-block">
      <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </div>
</form>
<script type="text/javascript">
//正常的情况才 下拉框是不显示的的，不许执行此方法才可以显示
  layui.use('form', function(){
  var form = layui.form(); //只有执行了这一步，部分表单元素才会修饰成功
});
</script>
<script>
layui.use(['form', 'layedit', 'laydate'], function(){
  var form = layui.form()
  ,layer = layui.layer
  ,layedit = layui.layedit
  ,laydate = layui.laydate;
  
  //创建一个编辑器
  var editIndex = layedit.build('LAY_demo_editor');
 
  //自定义验证规则
  form.verify({
    title: function(value){
      if(value.length < 5){
        return '标题至少得5个字符啊';
      }
    }
    ,pass: [/(.+){6,12}$/, '密码必须6到12位']
    ,content: function(value){
      layedit.sync(editIndex);
    }
  });
  
  
  
  //监听提交
  form.on('submit(demo1)', function(data){
    layer.alert(JSON.stringify(data.field), {
      title: '最终的提交信息'
    })
    return false;
  });
  
  
});
</script>
<script type="text/javascript">
    //实例化编辑器
    var um = UM.getEditor('myEditor');
    um.addListener('blur',function(){
        $('#focush2').html('编辑器失去焦点了')
    });
    um.addListener('focus',function(){
        $('#focush2').html('')
    });
    
</script>
<div class="pagination ue-clear"></div>

</body>
</html>
